<template>
    <div class="absolute -left-14 top-0 w-12 h-auto bg-[#1a1823]  rounded-xl flex flex-col gap-2  p-1">
        <router-link to="/user" class="w-10 h-10 p-1 rounded-lg flex justify-center items-center mb-4 cursor-pointer   hover:bg-[#221f2aff]">
          <img class="w-full h-full rounded-lg" src="https://img1.baidu.com/it/u=2526782352,137544254&fm=253&app=138&size=w931&n=0&f=JPEG&fmt=auto?sec=1697389200&t=48c26e78e138e88cfc418b17f1960bda" alt="">
        </router-link>
        <router-link :to="item.path" v-for="item in MenuList"  :key="item.path" class="w-10 h-10  rounded-lg flex justify-center items-center cursor-pointer  hover:bg-[#221f2aff]">
          <i class="iconfont  text-sm" :class="`icon-${item.icon}`"></i>
        </router-link>
      </div>
</template>

<script> 
export default{
  data(){
   return{
    MenuList:[
      {
        path:'/home',
        name:'首页',
        icon:'home',
      },
      {
        path:'/artist',
        name:'歌手',
        icon:'artist',
      },
      {
        path:'/album',
        name:'歌单',
        icon:'albums',
      }
    ]
   }
  },
  methods: {
  },
}
</script>